<template>
	<view>
		<view
			v-if="tableData.length > 0"
			class="list">
			<view
				v-for="(item, index) in tableData"
				:key="index"
				class="item">
				<view
					class="cell"
					@click="onSkip(`/package/we/pages/article-detail/detail?id=${item.id}`)">
					<view class="name">
						<text>{{ item.name }}</text>
					</view>
				</view>
			</view>
		</view>
		
		<view
			v-else
			class="null">
			<view class="">
				<view class="text">
					<text>暂无内容</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { $get	} from "@/api/index.js"
	
	export default {
		data() {
			return {
				option: {},
				tableData: []
			}
		},
		onLoad(option) {
			this.option = option
		},
		created() {
			this.getArticleList()
		},
		methods: {
			// 栏目数据
			async getArticleList () {
				const res = await $get('s=/ApiArticle/getartlist', {
					cid: this.option.cid
				})
				const { data, status, msg, title } = res.data
				uni.setNavigationBarTitle({ title });
				if (status == 1) {
					this.tableData = data
				} else {
					this.showToast(msg)
				}
			},
		}
	}
</script>

<style lang="less" scoped>
	.null {
		height: 100vh;
		background: #f8f8f8;
		padding: 100rpx 0;
		text-align: center;
		display: flex;
		align-items: center;
		justify-content: center;
		.text {
			color: #999;
		}
	}
	
	.list {
		min-height: 100vh;
		background: #f8f8f8;
		padding: 1rpx 0;
		.item {}
		.cell {
			margin: 20rpx;
			background: #fff;
			border-radius: 20rpx;
			overflow: hidden;
		}
		.cover {
			image {
				display: block;
				width: 100%;
				height: 400rpx;
			}
		}
		.name {
			padding: 40rpx;
			font-size: 30rpx;
			line-height: 1.2;
		}
	}
</style>
